<template>
<div>
  <el-breadcrumb separator="/">
    <el-breadcrumb-item :to="{ path:'/welcome'}">首页</el-breadcrumb-item>
    <el-breadcrumb-item>巡检管理</el-breadcrumb-item>
    <el-breadcrumb-item>巡检计划</el-breadcrumb-item>
  </el-breadcrumb>
  <el-card class="box-card">
    <el-row :gutter="20">
      <el-col :span="4">
        <el-button type="primary" @click="addDialogVisible=true">新增</el-button>
      </el-col>
    </el-row>
    <el-table stripe :data="InsList" style="width: 100%">
      <el-table-column prop="inspector" label="巡检人" width="180"></el-table-column>
      <el-table-column prop="inspection_material_division" label="巡检分区" width="180"></el-table-column>
      <el-table-column prop="inspection_time" label="巡检时间"></el-table-column>
      <el-table-column fixed="right" label="操作" width="180">
        <template slot-scope="">
          <el-button  type="primary" size="small" class="el-icon-edit"></el-button>
          <el-button type="danger" size="small" class="el-icon-delete" ></el-button>
        </template>
      </el-table-column>
    </el-table>
<!--    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="queryInfo.page" :page-sizes="[5, 10, 15, 30]" :page-size="queryInfo.size" layout="total, sizes, prev, pager, next, jumper"-->
<!--                   :total="total">-->
<!--    </el-pagination>-->
  </el-card>
  <el-dialog title="新增巡检计划" :visible.sync="addDialogVisible" width="50%" >
    <el-form  ref="ruleFormAdd" label-width="100px">
      <el-form-item label="巡检人" prop="inspector">
        <el-input ></el-input>
      </el-form-item>
      <el-form-item label="巡检分区" prop="inspection_material_division">
        <el-input ></el-input>
      </el-form-item>
      <el-form-item label="巡检时间" prop="inspection_time">
        <el-col :span="11">
          <el-date-picker type="date" placeholder="选择日期" v-model="from.date1" style="width: 100%;"></el-date-picker>
        </el-col>
        <el-col class="line" :span="2">————</el-col>
        <el-col :span="11">
          <el-time-picker placeholder="选择时间" v-model="from.date2" style="width: 100%;"></el-time-picker>
        </el-col>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary">确 定</el-button>
  </span>
  </el-dialog>
  <el-dialog title="修改用户信息" :visible.sync="editDialogVisible" width="50%" >
    <el-form ref="ruleFormEdit" label-width="100px">
      <el-form-item label="巡检人" prop="inspector">
        <el-input ></el-input>
      </el-form-item>
      <el-form-item label="巡检分区" prop="inspection_material_division">
        <el-input ></el-input>
      </el-form-item>
      <el-form-item label="巡检时间" prop="inspection_time">
        <el-input ></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
    <el-button @click="editDialogVisible = false">取 消</el-button>
    <el-button type="primary" >确 定</el-button>
  </span>
  </el-dialog>
</div>
</template>

<script>
export default {
  name: 'inspection',
  mounted () {
    this.getInpecList()
  },
  methods: {
    async getInpecList () {
      const { data: res } = await this.$http.get('sys/ins', { params: this.queryInfo })
      if (res.code !== 200) {
        return this.$message.error(res.msg)
      }
      this.InsList = res.data.result
      this.total = res.data.total
    },
    data () {
      return {
        from: {
          date1: '',
          date2: ''
        },
        addDialogVisible: false,
        editDialogVisible: false,
        total: 0,
        queryInfo: {
          inspector: '',
          page: 1,
          size: 5
        }

      }
    },
    InsList: [{}]
  }
}
</script>

<style scoped>

</style>
